<template>
  <view class="page container">
    <u-form
      :model="basicForm"
      :rules="rules"
      labelPosition="top"
      ref="form"
      labelWidth="auto"
      :labelStyle="{
        fontSize: '14px',
        color: '#B2B2B2',
        lineHight: '20px'
      }"
    >
      <view class="basic-style">
				<u-form-item label="岗位序列" prop="positionCategory" required>
				  <h-select-input-tag
				    class="w-100"
				    v-model="basicForm.positionCategory"
				    objectField="basicForm.positionCategory"
				    placeholder="请选择岗位序列"
				    border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
				    dictName="position_category"
				  ></h-select-input-tag>
				</u-form-item>
        <u-form-item label="岗位名称" prop="postId" required>
          <h-select-input-tag
            class="w-100"
            v-model="basicForm.postId"
            objectField="basicForm.postId"
            placeholder="请选择岗位"
            border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
            :dictName="postIdDict"
          ></h-select-input-tag>
        </u-form-item>
        <u-form-item label="工作地点" prop="workAddress" required>
          <u--input placeholder="请输入工作地点" v-model="basicForm.workAddress"></u--input>
        </u-form-item>
        <u-form-item label="所需人数" prop="requireQuantity" required>
					<h-number-input placeholder="请输入所需人数" v-model="basicForm.requireQuantity" :digit="0" :min="0" :max="99999999"></h-number-input>
        </u-form-item>
        <u-form-item label="学历要求" prop="educationalRequirements" required>
          <h-select-input-tag
            class="w-100"
            v-model="basicForm.educationalRequirements"
            objectField="basicForm.educationalRequirements"
            placeholder="请选择学历要求"
            border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
            dictName="educational_requirements"
          ></h-select-input-tag>
        </u-form-item>
        <u-form-item label="性别要求" prop="sexRequirements" required>
          <h-select-input-tag
            class="w-100"
            v-model="basicForm.sexRequirements"
            objectField="basicForm.sexRequirements"
            placeholder="请选择性别要求"
            border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
            dictName="sex_requirements"
          ></h-select-input-tag>
        </u-form-item>
        <u-form-item label="专业要求" prop="professionalRequirement" required>
          <h-select-input-tag
            class="w-100"
            v-model="basicForm.professionalRequirement"
            objectField="basicForm.professionalRequirement"
            placeholder="请选择专业要求"
            border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
            dictName="professional_requirement"
          ></h-select-input-tag>
        </u-form-item>
        <u-form-item label="工作经验" prop="workExperience" required>
          <h-select-input-tag
            class="w-100"
            v-model="basicForm.workExperience"
            objectField="basicForm.workExperience"
            placeholder="请选择工作经验"
            border="surround"
						suffixIcon="arrow-down-fill"
						:suffixIconStyle="{ color: '#B2B2B2' }"
            dictName="work_experience"
          ></h-select-input-tag>
        </u-form-item>
        <u-form-item label="薪资区间（元）" prop="salarySection" required>
          <u--input placeholder="请输入薪资区间（元）" v-model="basicForm.salarySection"></u--input>
        </u-form-item>
        <u-form-item label="期待到岗时间" prop="expectationTime" required>
          <h-time-select
            mode="date"
            ref="remittanceDate"
            v-model="basicForm.expectationTime"
            placeholder="请选择期待到岗时间"
            border="surround"
            suffixIcon="calendar-fill"
            :suffixIconStyle="{ color: '#B2B2B2' }"
          ></h-time-select>
        </u-form-item>
      </view>

      <view class="space-x-1 mt-1" style="display: flex">
        <u-button type="primary" text="关闭" :disabled="isSubmit" :plain="true" @click="onClose"></u-button>
				<u-button type="primary" text="保存" :disabled="isSubmit" @click="onSubmit"></u-button>
      </view>
    </u-form>
  </view>
</template>

<script>
import { queryProvisionBroadList, queryProvisionSmallList } from '@/api/purchase/ErpPurchaseCannibalizeForm'

export default {
  name: 'ErpPurchaseApplyMaterialForm',
  props: {
    teamId: {
      type: [String, Number],
      default: '',
    },
    companyId: {
      type: [String, Number],
      default: '',
    },
    // 表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
    datailDisabled: {
      type: Boolean,
      default: false,
    },
    index: {
      type: Number,
      default: null,
    },
    provisionBroad: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      api: {
        queryProvisionBroadList,
      },
      smallList: [],
      isSubmit: false,
			 postIdDict: 'sys_position,name,id,del_flag = 0 and audit_status=2',
      basicForm: {
				positionCategory: '', // 岗位序列
        postId: '',
        workAddress: '',
        requireQuantity: '',
        educationalRequirements: '',
        sexRequirements: '',
        professionalRequirement: '',
        workExperience: '',
        expectationTime: '',
      },
      rules: {
        postId: [{ required: true, message: '请选择岗位名称!' }],
        positionCategory: [{ required: true, message: '请选择岗位序列!' }],
        workAddress: [{ required: true, message: '请输入工作地点!' }],
        requireQuantity: [{ required: true, pattern: /^[1-9]\d*$/, message: '请输入所需人数!' }],
        educationalRequirements: [{ required: true, message: '请选择学历要求!' }],
        sexRequirements: [{ required: true, message: '请选择性别要求!' }],
        professionalRequirement: [{ required: true, message: '请选择专业要求!' }],
        workExperience: [{ required: true, message: '请选择工作经验!' }],
        salarySection: [{ required: true, message: '请选择薪资区间（元）!' }],
        expectationTime: [{ required: true, message: '请选择期待到岗时间!' }],
      },
    }
  },
  methods: {
    reset() {
      this.$refs.form.resetFields()
    },
		edit () {
			// return
		},
    async onSubmit() {
      await this.$refs.form.validate()
			this.isSubmit = true
      if (!this.index) {
        this.$emit('submit', [
          {
            id: parseInt(Math.random() * 1000000000000),
            ...this.basicForm,
          },
          this.index,
        ])
      } else {
        this.$emit('submit', [this.basicForm, this.index])
      }
    },
    onClose() {
      this.$emit('close')
			this.isSubmit = false
    },
  }
}
</script>

<style scoped>
.page.container {
	padding: 20px;
}
.basic-style {
	margin: 0;
	max-height: 80vh;
	overflow-y: auto;
}
.u-form-item {
	padding: 0px 8px;
}
</style>
